<template>
        <div id="top">
            <div id="top_logo">
                <img src="../assets/images/平台工程logo-浅色下.png" alt="" id="logo" texe="algin">
            </div>
            <div id="text">
                <p id="text-info">问卷调查</p>
            </div>
            <div id="headportrait">
                <img src="../assets/images/default-avatar.png" alt="" id="head">
            </div>
            <div id="name">
                <p id="name-info">{{username}}</p>
            </div>
        </div>
</template>
<script>
export default {
    data() {
        return {
            username : "姓名"
        }
    },
}
</script>
<style scoped>
#top {
    width: 19.1rem;
    height: 0.96rem;
    background: #FFFFFF;
}
#top_logo{
    margin: 0.2rem 0  0.18rem 3.55rem;
    height: 0.96rem;
    width: 2.92rem;
    float: left;
}
#logo{
    position: absolute;
    width: 2.92rem;
    height: 0.58rem;
}
#text{
    float: left;
    margin: 0.35rem 0 0.36rem 0.17rem;
}
#text-info{
    width: 0.96rem;
    height: 0.25rem;
    font-size: 0.24rem;
    font-family: Microsoft YaHei UI;
    font-weight: 400;
    color: #333333;
    line-height: 0.24rem;
    margin: 0 0 0 0.17rem;
    padding: 0 0 0 0.17rem;
    border-left: #EBEFF0 solid 0.01rem;
}
#headportrait{
    width: 0.32rem;
    height: 0.96rem;
    padding: 0.3rem 0 0 0;
    float: left;
    margin: 0 0 0 6.8rem;
}
#head{
    width: 0.32rem;
    height: 0.32rem;
    position: absolute;
}
#name{
    width: 0.33rem;
    font-size: 0.16rem;
    float: left;
    margin: 0.35rem 0 0 0.16rem;
}
#name-info{
    margin: 0;
}

</style>